<template>
	<div id="Line">
		<div style="margin-top: 10px;">
			路线编号:<el-input style="width: 200px;margin-left: 10px;" v-model="params.lineCode"
				placeholder="请输线路名称"></el-input>
			<!-- 下拉框 -->
			线路状态:<el-select style="margin-left: 10px;" v-model="params.RunningStatus" placeholder="请选择">
				<el-option v-for="item in typeObj" :key="item.id" :label="item.configValueName" :value="item.id">
				</el-option>
			</el-select>
			<el-button type="warning" style="margin-left: 10px;" @click="findBySearch()">查询</el-button>
			<el-button type="success" style="margin-left: 250px;" @click="addLine()">添加线路</el-button>
		</div>
		<div style="margin-top: 20px;">
			<el-table :data="tableData" style="width: 100%">
				<el-table-column prop="linecode" label="线路编号">
				</el-table-column>
				<el-table-column prop="linename" label="线路名称">
				</el-table-column>
				<el-table-column prop="startpole" label="起始杆号">
				</el-table-column>
				<el-table-column prop="endpole" label="终止杆号">
				</el-table-column>
				<el-table-column prop="towerbasenum" label="塔基数">
				</el-table-column>
				<el-table-column prop="runningstatusname" label="运行状态">
				</el-table-column>
				<el-table-column prop="isstart" label="启用状态">
				</el-table-column>
				<el-table-column label="操作" width="400">
					<template slot-scope="scope">
						<el-button type="primary" @click="updateIsStart(scope.row)">停用</el-button>
						<el-button type="primary" @click="upd(scope.row)">修改</el-button>
						<el-popconfirm title="确定删除吗？" @confirm="del(scope.row.id)">
							<el-button style="margin-left: 5px;" type="danger" slot="reference">删除</el-button>
						</el-popconfirm>
					</template>
				</el-table-column>
			</el-table>
		</div>
		<!-- 分页 -->
		<div style="margin-top: 10px;">
			<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
				:current-page="params.pageNum" :page-sizes="[5, 10, 15, 20]" :page-size="params.pageSize"
				layout="total, sizes, prev, pager, next" :total="total">
			</el-pagination>
		</div>
		<!-- 嵌套 -->
		<div>
			<!-- Form -->
			<el-dialog title="请填写信息" :append-to-body="true" :visible.sync="dialogFormVisible" width="40%">
				<el-form :model="form">
					<el-form-item label="线路编码" label-width="20%">
						<el-input v-model="form.linecode" autocomplete="off" style="width: 90%;"></el-input>
					</el-form-item>
					<el-form-item label="线路名称" label-width="20%">
						<el-input v-model="form.linename" autocomplete="off" style="width: 90%;"></el-input>
					</el-form-item>
					<el-form-item label="线路长度" label-width="20%">
						<el-input v-model="form.linelength" autocomplete="off" style="width: 90%;"></el-input>
					</el-form-item>
					<el-form-item label="回路长度" label-width="20%">
						<el-input v-model="form.backlength" autocomplete="off" style="width: 90%;"></el-input>
					</el-form-item>
					<el-form-item label="投运日期" label-width="20%">
						<el-date-picker v-model="form.productdate" type="date" style="width: 90%" placeholder="选择日期"
							value-format="yyyy-MM-dd"></el-date-picker>
					</el-form-item>
					<el-form-item label="电压等级" label-width="20%">
						<el-input v-model="form.voltagelevel" autocomplete="off" style="width: 90%;"></el-input>
					</el-form-item>
					<el-form-item label="起始杆号" label-width="20%">
						<el-input v-model="form.startpole" autocomplete="off" style="width: 82%;"></el-input>
						<el-button icon="el-icon-circle-plus" @click="startpole"></el-button>
					</el-form-item>
					<el-form-item label="终止杆号" label-width="20%">
						<el-input v-model="form.endpole" autocomplete="off" style="width: 82%;"></el-input>
						<el-button icon="el-icon-circle-plus" @click="endpole"></el-button>
					</el-form-item>
					<el-form-item label="塔基数" label-width="20%">
						<el-input v-model="form.towerbasenum" autocomplete="off" style="width: 90%;"></el-input>
					</el-form-item>
					<el-form-item label="是否启用" label-width="20%">
						<el-radio v-model="form.isstart" label="1">启用</el-radio>
						<el-radio v-model="form.isstart" label="0">未启用</el-radio>
					</el-form-item>
					<el-form-item label="备注" label-width="20%">
						<el-input v-model="form.common" autocomplete="off" style="width: 90%;"></el-input>
					</el-form-item>
				</el-form>
				<div slot="footer" class="dialog-footer">
					<el-button @click="dialogFormVisible = false">取 消</el-button>
					<el-button type="primary" @click="submit()">确 定</el-button>
				</div>
			</el-dialog>
		</div>
		<!-- 终止 -->
		<div>
			<!-- Form -->
			<el-dialog title="请填写信息" :append-to-body="true" :visible.sync="dialogFormVisible1" width="30%">
				<el-form :model="form2"  style="width: 40%">
					<el-table ref="multipleTable" :data="tableData2" tooltip-effect="dark" style="width: 100%"
						@selection-change="handleSelectionChange">
						<el-table-column type="selection" width="90px">
						</el-table-column>
						<el-table-column prop="poleCode" label="杆塔编号" width="120">
						</el-table-column>
					</el-table>
				</el-form>
				<div slot="footer" class="dialog-footer">
					<el-button @click="dialogFormVisible1 = false">取 消</el-button>
					<el-button type="primary" @click="submit1()">确 定</el-button>
				</div>
			</el-dialog>
		</div>
	</div>
</template>

<script>
	import axios from 'axios';
	import LineManagementViewVue from './LineManagementView.vue'; //路线管理
	export default {
		name: "Line",
		data() {
			return {
				form2:{},
				form: {},
				typeObj: [],
				tableData: [],
				tableData2: [],
				params: {
					LineCode: '',
					RunningStatus: '',
					pageNum: 1,
					pageSize: 5
				},
				total: 0,
				dialogFormVisible: false,
				radio: '1',
				dialogFormVisible1: false
			};
		},
		methods: {
			startpole() {
				console.log("起始值被点击了");
				this.findBySearch2();
				this.dialogFormVisible1 = true
			},
			endpole(){
				console.log("终止值被点击了");
				this.findBySearch3();
				this.dialogFormVisible1 = true
			},
			findBySearch() {
				// if (this.form.isstart === 1) {
				// 	this.tableData.isstart ="启动"
				// 	alert(this.tableData.isstart)
				// }else if(this.form.isstart === 0){
				// 	this.tableData.isstart ="未启动"
				// 	alert(this.tableData.isstart)
				// }
				console.log('点击了');
				axios.get('http://localhost:8080/psLineInfo/psLineInfoPage', {
					params: this.params,
				}).then(res => {
					console.log(JSON.stringify(res))
					if (res.data.code === '0') {
						this.tableData = res.data.data.records;
						this.total = res.data.data.total;
					} else {
						this.$message({
							message: res.data.msg,
							type: 'error'
						});
					}
				})
			},
			findBySearch2() {
				console.log('点击了');
				axios.get('http://localhost:8080/psPoleInfo/selectAllpoleCodeAsc', {
				}).then(res => {
					console.log(JSON.stringify(res))
					if (res.data.code === '0') {
						this.tableData2 = res.data.data;
					} else {
						this.$message({
							message: res.data.msg,
							type: 'error'
						});
					}
				})
			},
			findBySearch3() {
				console.log('点击了');
				axios.get('http://localhost:8080/psPoleInfo/selectAllPoleCodeDesc', {
				}).then(res => {
					console.log(JSON.stringify(res))
					if (res.data.code === '0') {
						this.tableData2 = res.data.data;
					} else {
						this.$message({
							message: res.data.msg,
							type: 'error'
						});
					}
				})
			},
			handleSizeChange(pageSize) {
				// 查询每页的页数
				this.params.pageSize = pageSize;
				this.findBySearch();
			},
			handleCurrentChange(pageNum) {
				// 下一页的数据
				this.params.pageNum = pageNum;
				this.findBySearch();
			},
			addLine() {
				this.form = {};
				this.dialogFormVisible = true;
			},
			upd(obj) {
				this.form = obj;
				this.dialogFormVisible = true;
			},
			updateIsStart(obj) {
				console.log(obj);
				axios.post('http://localhost:8080/psLineInfo/updateIsStart', {
					id: obj.id,
					isstart: obj.isstart,
				}).then(res => {
					console.log(JSON.stringify(res))
					if (res.data.code === '0') {
						this.$message({
							message: "修改成功",
							type: 'success'
						});
						this.findBySearch();
					} else {
						this.$message({
							message: res.data.msg,
							type: 'error'
						});
					}
				})
			},
			submit() {
				//修改和添加
				axios.post("http://localhost:8080/psLineInfo/addPsLineInfo", this.form).then(res => {
					if (res.data.code === '0') {
						this.$message({
							message: '操作成功',
							type: 'success'
						});
						this.dialogFormVisible = false;
					} else {
						this.$message({
							message: res.data.msg,
							type: 'error'
						});
					}
				})
			},
			del(id) {
				console.log(id);
				axios.get("http://localhost:8080/psLineInfo/delPsLineInfo?id=" + id).then(res => {
					if (res.data.code === '0') {
						this.$message({
							message: '删除成功',
							type: 'success'
						});
						this.findBySearch();
					} else {
						this.$message({
							message: res.data.msg,
							type: 'error'
						});
					}
				})
			},
			findTypes() {
				axios.get("http://localhost:8080/psLineInfo/runningStatus").then(res => {
					console.log(res);
					if (res.data.code === '0') {
						//下拉
						// this.typeObj = res.data.data[0].configValueName;
						this.typeObj = res.data.data;
					} else {
						this.$message.error("错误信息");
					}
				})
			}
		},
		created() {
			this.findBySearch();
			this.findTypes();
			console.log("下拉" + this.typeObj);
		},
		components: {
			LineManagementViewVue
		}
	};
</script>

<style>
</style>